<template>
    <div>
        <el-tabs tab-position="top" v-model="activeName">
            <!-- 用户资料 -->
            <el-tab-pane :label="$i18n.t('USER_INFO')" name="default">
                <collection-user-info />
            </el-tab-pane>
            <!-- 订单详情 -->
            <el-tab-pane :label="$i18n.t('ORDER_INFO')" name="order">
                <collection-order-info v-if="activeName === 'order'" />
            </el-tab-pane>
            <!-- 任务跟进 -->
            <el-tab-pane :label="$i18n.t('TASK_FOLLOW')" name="follow">
                <collection-follow v-if="activeName === 'follow'" />
            </el-tab-pane>
            <!-- 历史记录 -->
            <el-tab-pane :label="$i18n.t('HISTORY_RECORD')" name="history">
                <collection-history-record v-if="activeName === 'history'" />
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
    import CollectionUserInfo from '@/views/collection/components/UserInfo'
    import CollectionFollow from '@/views/collection/components/TaskFollow'
    import CollectionOrderInfo from '@/views/collection/components/OrderInfo'
    import CollectionHistoryRecord from '@/views/collection/components/HistoryRecord'

    export default {
        name: 'CollectionDetail',
        components: {
            CollectionHistoryRecord,
            CollectionOrderInfo,
            CollectionFollow,
            CollectionUserInfo
        },
        data () {
            return {
                activeName: 'default'
            }
        }
    }
</script>

<style lang="less" scoped>
</style>
